.in-enter-active {
  // 入场的过渡状态类
  transition: all 0.7s;
  transform: translate(0, 0) !important;
}

.in-enter-done {
  // 入场的动画的结束状态类
  // opacity: 0.7;
  height: 100%;
  transform: translate(0, 0) !important;
}

.in-enter {
  // 入场的动画开始状态类
  z-index: 5 !important;
  transform: translate(100%, 0);
  height: 100%;
}

.in-exit-active {
  // 离场动画
  opacity: 0;
  height: 100%;
  transition: all 0.7s;
  transform: translate(-100%, 0) !important;
}

.in-exit {
  // 离场动画开始
  // transform: translate(0, 0)!important;
}
.in-exit-done {
  // 离场动画结束
}

// 返回动画
.back-enter-active {
  // 入场的过渡状态类
  transition: all 0.7s;
  transform: translate(0, 0) !important;
}
.back-enter-done {
  // 入场的动画的结束状态类
  // opacity: 0.7;
  height: 100%;
  transform: translate(0, 0) !important;
}

.back-enter {
  // 入场的动画开始状态类
  z-index: 5 !important;
  transform: translate(-100%, 0);
}

.back-exit-active {
  // 离场动画
  opacity: 0;
  transition: all 0.7s;
  transform: translate(100%, 0) !important;
}

.back-exit {
  // 离场动画开始
  // transform: translate(0, 0)!important;
}
.back-exit-done {
  // 离场动画结束

  height: 100%;
}
